<!doctype html>
<html lang="en">
<head>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
    <meta charset="UTF-8">
    <title>数据统计</title>
    <style>
        body,div,p,ul,ol,li,dl,dt,dd,form,input,table,img,h1,h2,h3,h4,h5,h6,header,section,footer,nav,figure,figcaption,article{
        font-size: 14px;
        margin:0;
        padding:0;
        text-align:center
        }

        body,html{
        height: 100%;
        background: #EBECEB;
        }
        .box img{
        width: 150px;
        margin:0 auto 25px auto;
        padding-top: 120px;
        display: block;
        }
        .box_title{
        color: #333;
        text-align: center;
        font-size:16px ;
        }
        .box_con{
        font-size: 14px;
        text-align: center;
        color: #999;
        margin-top: 20px;
        }
        .box_btn{
        display: block;
        outline: medium;
        text-align: center;
        background: #2a8eed;
        color: #f9f9f9;
        width: 152px;
        height: 38px;
        line-height: 38px;
        margin: 25px auto 0 auto;
        border-radius: 4px;
        border: none;
        }
        .normal-a{
        outline: none;
        color: #333;
        text-decoration: none;
        }
        .underline{
        outline: none;
        color: #333;
        text-decoration: underline;
        }
        h4{
            font-size: 18px;
            margin-top: 8px;
        }
        table {
            display: table;
            border-collapse: separate;
            border-spacing: 2px;
            border-color: grey;
        }
        tbody {
            display: table-row-group;
            vertical-align: middle;
            border-color: inherit;
        }
        table.box_table{
            margin-top: 8px;
            border-collapse: collapse;
            border: 1px solid #aaa;
            width: 100%;
        }

        table.box_table td {
             
            padding: 10px 8px 10px 8px;
            border: 1px solid #aaa;
        }
        table.box_table th {
            
            padding: 10px 8px 10px 8px;
            border: 1px solid #aaa;
        }
        table.box_table th {
            background-color: #0083f9;
        }

    </style>
</head>
<body onload="initData()" >
<script type="text/javascript">

   function initData(){
       
        console.log("initData");
        console.log(window.JSFinishOrder);
       // window.JSFinishOrder.goToPage('getUserDataStatics');
       //var json = "{\"date\":\"2018-06-14\",\"sucPick\":{\"returned\":100,\"order\":200,\"oxo\":300},\"failPick\":{\"returned\":400,\"order\":500,\"oxo\":600},\"created\":90,\"pickReturnedAmount\":89.34,\"pickExpressAmount\":8943.22,\"pickAmount\":343.44,\"deliveryList\":[{\"payment\":\"现金\",\"count\":10,\"amount\":20},{\"payment\":\"通联POS\",\"count\":10,\"amount\":20},{\"payment\":\"银商POS\",\"count\":10,\"amount\":20},{\"payment\":\"微信扫码\",\"count\":10,\"amount\":20},{\"payment\":\"支付宝扫码\",\"count\":10,\"amount\":20}],\"deliveryFailure\":22}";
       //var json = "{\"delivery\":{\"successStatistics\":{\"totalTransport\":0,\"dtList\":[{\"curActualAmount\":0,\"actualPayment\":0,\"curTotalTransport\":0,\"actualPaymentName\":\"现金\"},{\"curActualAmount\":0,\"actualPayment\":5,\"curTotalTransport\":0,\"actualPaymentName\":\"通联POS\"},{\"curActualAmount\":0,\"actualPayment\":12,\"curTotalTransport\":0,\"actualPaymentName\":\"银商POS\"},{\"curActualAmount\":0,\"actualPayment\":3,\"curTotalTransport\":0,\"actualPaymentName\":\"微信扫码\"},{\"curActualAmount\":0,\"actualPayment\":2,\"curTotalTransport\":0,\"actualPaymentName\":\"支付宝扫码\"},{\"curActualAmount\":0,\"curTotalTransport\":0,\"actualPaymentName\":\"无需支付\"}],\"actualAmount\":0,\"actualPaymentName\":\"合计\"},\"failStatistics\":{\"totalTransport\":0}},\"orderReceive\":{\"successB19\":0,\"successOrderNum\":0,\"successOxo\":0,\"successReturnNum\":0,\"failB19\":0,\"failReturnNum\":0,\"completedNum\":25,\"failOrderNum\":0},\"orderReceiveAmount\":{\"cashReturnAmount\":0.0,\"cashExpressAmount\":258.85,\"cashAmountTotal\":258.85},\"orderReceiveAmountNew\":[{\"transportTypeName\":\"快递\",\"transportType\":3,\"list\":[{\"totalAmount\":189.34,\"transportType\":3,\"actualPayment\":-2,\"totalTransport\":21,\"actualPaymentName\":\"\"},{\"totalAmount\":69.51,\"transportType\":3,\"actualPayment\":0,\"totalTransport\":4,\"actualPaymentName\":\"现金\"}]}]}"
       //setData(json);
    } 

    function goToPage(pageName){

        alert(pageName);
        //console.log("goToPage="+pageName);
        //userData.goToPage(pageName);
        //window.JSFinishOrder.goToPage(pageName);
        window.webkit.messageHandlers.JSFinishOrder.postMessage({
            "pageName": pageName
        });
    }
    function setData(json){
        
            console.log("json="+json);
            var obj = JSON.parse(json);
            document.getElementById("successReturnNum").innerHTML = "<a  class=\"underline\" href=\"javascript:void(0);\" >"+obj.orderReceive.successReturnNum+"</a>";
            document.getElementById("successOrderNum").innerHTML = "<a class=\"underline\" href=\"javascript:void(0);\" >"+obj.orderReceive.successOrderNum +"</a>" ;
            document.getElementById("successOxo").innerHTML = "<a class=\"normal-a\" href=\"javascript:void(0);\">"+obj.orderReceive.successOxo+"</a>";
            document.getElementById("successB19").innerHTML = "<a class=\"underline\" href=\"javascript:void(0);\">"+obj.orderReceive.successB19+"</a>";
            document.getElementById("failReturnNum").innerHTML = "<a class=\"underline\" href=\"javascript:void(0);\" >"+obj.orderReceive.failReturnNum+"</a>";
            document.getElementById("failOrderNum").innerHTML = "<a class=\"underline\" href=\"javascript:void(0);\">"+obj.orderReceive.failOrderNum+"</a>";
            document.getElementById("failB19").innerHTML = "<a class=\"underline\" href=\"javascript:void(0);\">"+obj.orderReceive.failB19+"</a>";
            document.getElementById("completedNum").innerHTML = "<a class=\"underline\" href=\"javascript:void(0);\" >"+obj.orderReceive.completedNum+"</a>";

            var receiverStaticInnerHtml =  '<tbody><tr><th  >订单类型</th><th>支付方式</th> <th>订单量</th><th>总金额（元）</th></tr>'


            if(obj.orderReceiveAmountNew){

                var receiverLength = obj.orderReceiveAmountNew.length
                for(k=0;k<receiverLength;k++){
                    var orderReceiveAmountNewItem = obj.orderReceiveAmountNew[k]
                    if(orderReceiveAmountNewItem){
                        receiverStaticInnerHtml = receiverStaticInnerHtml+"<tr> "
                        var receiverList = orderReceiveAmountNewItem.list
                        var receiverItemLength = receiverList.length
                        for(i = 0;i < receiverItemLength; i++) {

                            if(i==0){
                                receiverStaticInnerHtml = receiverStaticInnerHtml+'<td rowspan="'+(receiverItemLength)+'">'+orderReceiveAmountNewItem.transportTypeName+'</td>';
                            }
                            receiverStaticInnerHtml = receiverStaticInnerHtml+'<td>'+receiverList[i].actualPaymentName+'</td><td>'+receiverList[i].totalTransport+'</td><td>' +receiverList[i].totalAmount+'</td>';
                            receiverStaticInnerHtml = receiverStaticInnerHtml+"</tr> "
                        }
                    }
                }
                receiverStaticInnerHtml = receiverStaticInnerHtml+'</tbody>'
                document.getElementById("receiver_pay_statics").innerHTML = receiverStaticInnerHtml;
            }
            //document.getElementById("cashReturnAmount").innerHTML = obj.orderReceiveAmount.cashReturnAmount;
            //document.getElementById("cashExpressAmount").innerHTML = obj.orderReceiveAmount.cashExpressAmount;
            //document.getElementById("cashAmountTotal").innerHTML = obj.orderReceiveAmount.cashAmountTotal;
            //document.getElementById("deliveryFailure").innerHTML = obj.deliveryFailure;
            var payStaticsInnerHtml = '<tbody><tr><th  >配送结果</th><th>支付方式</th> <th>订单量</th><th>总金额（元）</th></tr>'
            if(obj.delivery && obj.delivery.successStatistics){
                    if(obj.delivery.successStatistics.dtList){
                        var list = obj.delivery.successStatistics.dtList;
                        var length = list.length;
                        console.log('lenght='+length)
                        // var totalOrderNum = 0;
                        // var totalAmount = 0;
                        for(j = 0; j < length; j++) {
                            payStaticsInnerHtml = payStaticsInnerHtml+"<tr> "
                            if(j==0){
                                payStaticsInnerHtml = payStaticsInnerHtml+'<td rowspan="'+(length+1)+'">签收</td>';
                            }
                            // totalOrderNum = totalOrderNum+list[j].count;
                            // totalAmount  = totalAmount+list[j].amount;
                            payStaticsInnerHtml = payStaticsInnerHtml+'<td>'+list[j].actualPaymentName+'</td><td>'+list[j].curTotalTransport+'</td><td>'+list[j].curActualAmount+'</td>';

                            payStaticsInnerHtml = payStaticsInnerHtml+"</tr> "
                        }
                }
                payStaticsInnerHtml = payStaticsInnerHtml+'<tr><td>合计</td><td onclick=\"goToPage(\'orderReceiveTotal\')\"><a class=\"underline\" href=\"javascript:void(0);\">'+ obj.delivery.successStatistics.totalTransport+'</td> <td>'+obj.delivery.successStatistics.actualAmount+'</td></tr>';
            }
            payStaticsInnerHtml = payStaticsInnerHtml+'</tbody>'
            if(obj.delivery && obj.delivery.failStatistics){
                payStaticsInnerHtml = payStaticsInnerHtml+'<tr> <td>投递失败</td> <td>--</td><td  onclick=\"goToPage(\'failTotalTransport\')\"><a class=\"underline\" href=\"javascript:void(0);\" >'+obj.delivery.failStatistics.totalTransport+'</a></td><td>--</td></tr>';
            }
            document.getElementById("pay_statics").innerHTML = payStaticsInnerHtml;
    }

</script>
<div class="box">
    <h4>揽件量统计</h4>

    <table class="box_table">
        <tbody>
        <tr>
            <th>揽收结果</th>
            <th>揽退单</th>
            <th>预约单</th>
            <th>OXO单</th>
            <th>直退单</th>
        </tr>
        <tr>
            <td>揽件成功</td>
            <td id='successReturnNum' onclick="goToPage('SuccessReturn')"></td>
            <td id='successOrderNum' onclick="goToPage('SuccessOrder')"></td>
            <td id='successOxo' onclick="goToPage('SuccessOxo')"></td>
            <td id='successB19' onclick="goToPage('SuccessB19')"></td>
        </tr>
        <tr>
            <td>揽件失败</td>
            <td id='failReturnNum' onclick="goToPage('FailReturn')"></td>
            <td id='failOrderNum' onclick="goToPage('FailOrder')"></td>
            <td>--</td>
            <td id='failB19' onclick="goToPage('FailB19')"></td>
        </tr>
        <tr>
            <td>录单完成</td>
            <td td colspan="3" id='completedNum' onclick="goToPage('Completed')"></td>
        </tr>
        </tbody>
    </table>

    <h4>揽收金额统计</h4>
    <table class="box_table" id='receiver_pay_statics'>
    </table>
    <h4>配送量统计</h4>

    <table class="box_table" id='pay_statics'>

    </table>
</div>
</body>

</html>
